<template>
  <h1>子组件的钱： {{ money }}</h1>
  <button @click="subMoney">花了50</button>
  <a-child />
</template>
<script>
import AChild from './child-a-child.vue'
export default {
  name: 'child-a',
  emits: ['update:money'],
  props: {
    money: {
      type: Number,
      required: true
    }
  },
  components: {
    AChild
  },
  setup(props, context) {
    // context 是一个普通的 JavaScript 对象，它暴露组件的三个 property
    // Attribute (非响应式对象)
    console.log(context.attrs)
    // 插槽 (非响应式对象)
    console.log(context.slots)
    // 触发事件 (方法)
    console.log(context.emit)
    const subMoney = () => {
      context.emit('update:money', -50)
    }
    return {
      subMoney
    }
  }
}
</script>